<template>
  <el-form ref="elform1" style="padding: 12px;">
    <el-row>
      <el-col :span="24">
        <el-form-item label="请选择基准参与者：">
          <el-link type="primary" :underline="false" @click="setBaseActor"
            >设置参与者属性</el-link
          >
          <el-select v-model="models.baseActor.className">
            <el-option value label="请选择"></el-option>
            <el-option
              v-for="item in controlData.actorOptions"
              :key="item.className"
              :value="item.className"
              :label="item.displayName"
              >{{ item.displayName }}</el-option
            >
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <el-form-item label=" 请选择部门： ">
          <el-cascader
            ref="deptTree"
            v-model="models.modelDepartmentId.value"
            clearable
            size="medium "
            placeholder="请选择"
            @change="deptChange"
            :options="deptTree"
            :show-all-levels="false"
            :props="{ value: 'id', label: 'text', checkStrictly: true }"
          ></el-cascader>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <el-form-item label="指定岗位：">
          <span style="color: red;">多个岗位请用逗号隔开</span>
          <el-input
            type="textarea"
            :rows="5"
            v-model="models.modelPosition.value"
          ></el-input>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="24">
        <el-form-item label="向上递归：">
          <el-select v-model="models.upRecursive.value">
            <el-option value="false" label="否">否</el-option>
            <el-option value="true" label="是">是</el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
    <!-- <el-row>
      <el-col :span="24">
        <el-form-item
          label=" 请选择岗位："
          prop="models.modelPosition.value"
          :rules="[{required: true, message: '岗位不能为空'}]"
        >
          <el-select
            v-model="models.modelPosition.value"
            clearable
            remote
            placeholder="请选择"
            :remote-method="loadPositions"
          >
            <el-option
              v-for="item in positions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>-->

    <vxe-modal
      v-model="xxxActorModel.visible"
      :width="800"
      :height="630"
      :title="xxxActorModel.title"
      @close="xxxActorModel.visible = false"
      destroy-on-close
      :showFooter="
        xxxActorModel.compName &&
          !['CurrentUserActor', 'CreatorActor'].includes(xxxActorModel.compName)
      "
    >
      <component
        :is="xxxActorModel.compMap[xxxActorModel.compName]"
        v-if="xxxActorModel.compName"
        :models="xxxActorModel.models"
        :controlData="xxxActorModel.controlData"
      ></component>
      <template #footer>
        <el-row class="qm-table-form-row">
          <el-button
            type="primary"
            :loading="xxxActorModel.saveLoading"
            size="small"
            @click="actorModelSave"
            icon="el-icon-circle-check"
            v-if="xxxActorModel.compName != 'TaskHandlerActor'"
            >保 存</el-button
          >
          <el-button
            type="primary"
            size="small"
            @click="taskHandlerActorModelSave"
            icon="el-icon-circle-check"
            v-else
            >保 存</el-button
          >
          <el-button
            @click="xxxActorModel.visible = false"
            icon="el-icon-circle-close"
            size="small"
            >取消</el-button
          >
        </el-row>
      </template>
    </vxe-modal>
  </el-form>
</template>

<script>
import request from "@/utils/request";
import AccountActor from "@/views/workflow/actExtTaskActorAttr/accountActor";
import CreatorActor from "@/views/workflow/actExtTaskActorAttr/creatorActor";
import CurrentUserActor from "@/views/workflow/actExtTaskActorAttr/currentUserActor";
import DepartmentActor from "@/views/workflow/actExtTaskActorAttr/departmentActor";
import GroupActor from "@/views/workflow/actExtTaskActorAttr/groupActor";
import TaskHandlerActor from "@/views/workflow/actExtTaskActorAttr/taskHandlerActor";

export default {
  name: "position-actor",
  components: {
    AccountActor,
    CreatorActor,
    CurrentUserActor,
    DepartmentActor,
    GroupActor,
    TaskHandlerActor
  },
  props: {
    models: Object,
    controlData: Object
  },
  data() {
    return {
      deptTree: this.controlData.deptTree,
      positions: [],
      xxxActorModel: {
        visible: false,
        title: "设置参与者属性",
        models: {},
        controlData: {},
        compName: "",
        compMap: {
          AccountActor: AccountActor,
          CreatorActor: CreatorActor,
          CurrentUserActor: CurrentUserActor,
          DepartmentActor: DepartmentActor,
          GroupActor: GroupActor,
          TaskHandlerActor: TaskHandlerActor
        }
      }
    };
  },
  computed: {
    className() {
      return this.models.baseActor.className;
    }
  },
  watch: {
    className(n, o) {
      this.models.baseActor.attributes = null;
    }
  },
  methods: {
    loadPositions: function(query) {
      request({
        url: "/admin/sysPosition/getPositionsNames",
        method: "get",
        params: { departmentId: query || "" }
      }).then(r => {
        this.positions = r.map(m => {
          return { value: m.name, label: m.name };
        });
      });
    },
    deptChange: function(d) {
      if (d.length > 0) {
        this.models.modelDepartment.value = this.$refs.deptTree.getCheckedNodes()[0].data.text;
        this.models.modelDepartmentId.value = d[d.length - 1];
        this.models.modelPosition.value = null;
        this.loadPositions(d[d.length - 1]);
      } else {
        this.models.modelDepartment.value = null;
        this.models.modelPosition.value = null;
        this.loadPositions();
      }
    },
    setBaseActor() {
      let cls = this.models.baseActor.className;
      if (!cls) {
        this.msgError("请选择基准参与者");
        return;
      }
      let params = {
        className: cls,
        baseActor: true,
        taskActorId: this.models.baseActor.taskActorId,
        attrId: this.models.baseActor ? this.models.baseActor.attrId : ""
      };
      let url = "/workflow/actExtTaskActorAttr/getTaskActorAttrModel";
      request({
        url: url,
        method: "post",
        data: { ...params }
      })
        .then(vm => {
          this.xxxActorModel = _.extend({}, this.xxxActorModel, vm || {});
          // this.xxxActorModel.models = vm.models;
          // this.xxxActorModel.controlData = vm.controlData;
          let li = cls.lastIndexOf(".");
          this.xxxActorModel.compName = cls.substr(li + 1);
          this.xxxActorModel.visible = true;
        })
        .catch(e => {
          this.xxxActorModel.visible = false;
        });
    },
    actorModelSave() {
      let postModels = this.xxxActorModel.models;
      postModels.pageAction = this.xxxActorModel.pageAction;
      if (
        postModels.pageAction === "edit" &&
        !_.isEmpty(this.xxxActorModel.primaryKey)
      ) {
        _.each(this.xxxActorModel.primaryKey, (v, k) => {
          postModels[k] = v;
        });
      }
      if (
        !this.xxxActorModel.urls ||
        !this.xxxActorModel.urls.save ||
        _.isEmpty(postModels)
      ) {
        this.notifyError("没有指定保存的url或postModels");
        return;
      }

      let url = this.xxxActorModel.urls.save;
      this.xxxActorModel.saveLoading = true;
      request({
        url: url,
        method: "post",
        data: postModels
      })
        .then(r => {
          this.xxxActorModel.saveLoading = false;
          if (r && r.success) {
            this.setBaseActorAttributes();
            this.notifySuccess(r.message || "保存成功");
          } else {
            this.notifyError(r.message || "保存失败");
          }
          this.xxxActorModel.visible = false;
        })
        .catch(e => {
          this.xxxActorModel.saveLoading = false;
          this.notifyError((e || {}).message || "保存失败");
        });
    },
    taskHandlerActorModelSave() {
      this.setBaseActorAttributes();
      this.xxxActorModel.visible = false;
    },
    setBaseActorAttributes() {
      const attributes = { 
        taskName: this.xxxActorModel.models.model.value 
      };
      if (this.models.baseActor) {
        this.models.baseActor.attributes = attributes;
      } else {
        this.models.baseActor = {
          attributes: attributes
        };
      }
    }
  },
  mounted() {
    this.loadPositions();
  }
};
</script>

<style></style>
